// 简单封装一个ajax函数
// 参数1    请求的url地址
// 参数2    请求的方式 默认值是 get 
// 参数3    请求携带的参数数据 默认值是 ''
// 参数4    请求成功执行的函数程序 默认值是 空函数
// 参数5    请求结果 的 数据类型 默认值是 text字符串文本类型 可以设定 json字符串类型
function myAjax( url , type = 'get' , data = '' , callback = function(){} , dataType = 'text' ){
    // 1 创建 ajax对象
    const xhr = new XMLHttpRequest();


    // 2 判断 发送请求的方式 统一 大小写 
    if( type.toLowerCase() === 'get' ){
        // 设定 请求方式是 get 时 执行的 ajax程序
        xhr.open( 'get' , `${url}?${data}` );
        xhr.send();

    }else if( type.toLowerCase() === 'post' ){
        // 设定 请求方式是 post 时 执行的 ajax程序
        xhr.open( 'post' , url );
        xhr.setRequestHeader('Content-Type' , 'application/x-www-form-urlencoded');
        xhr.send(data);
    }

    // 3 获取 响应体结果
    // ajax状态码是 4 
    // http状态码是 200-299
    // 表示 ajax请求 结束 并且执行成功
    xhr.onreadystatechange = function(){
        // if( xhr.readyState === 4 && ( xhr.status >= 200 && xhr.status <= 299 ) ){
        if( xhr.readyState === 4 && /^2\d{2}$/.test(xhr.status)   ){
            // ajax请求结束 并且 成功
            // 调用执行 回调函数 
            // 回调函数 具体的程序 是 根据 响应体数据来执行不同的程序代码
            // 回调函数 需要的实际参数数据 是 响应体 数据数值
            // 如果是 json字符串 需要还原为对应的数据结果
            callback( dataType === 'json' ? JSON.parse( xhr.response ) : xhr.response ) ;  
        }
    }
}  


// 封装一个函数 使用 promise语法 调用执行 ajax函数
function myPromiseAjax(url , type = 'get' , data = '' , dataType = 'text'){
    // 创建一个 promise实例化对象 
    const p = new Promise(function(f,r){
        // 调用 异步 ajax请求
        // f 通过 promise对象.then() 来 定义
        myAjax( url , type , data , f , dataType );
    }) ;

    // 返回值 就是 创建的promise实例化对象
    return p ;
}


// 封装一个函数 使用 promise语法 调用执行 jQuery的ajax() 函数方法
// 完成 异步的ajax 请求
function myPromiseJQueryAjax( url , type = 'get' , data = {} , dataType = 'text' ){
    // 创建 promise实例化对象
    const p = new Promise(function(f,r){
        // 通过 jQuery的ajax() 函数 完成 异步的ajax请求
        $.ajax({
            url: url,
            type: type,
            data: data,
            dataType: dataType,
            success: f,
            error: r,
        })
    })

    // return 返回这个实例化 对象
    return p ;
}